{include file="public/header"}


<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <title>商家认证>未认证</title>
    <link rel="stylesheet" type="text/css" href="__CSS__/tt.css" />
    <style>
        .hidden {
            display: none !important;
        }
        html,
        body {
            width: 100%;
            background: rgba(238, 238, 238, 1);
            margin:0;
            padding:0;
            word-wrap: break-word;
            word-break: break-all;
        }
        .container{
            padding-top:30px;
            padding-bottom:80px;
        }
        .box{
            width:1200px;
            /*height:800px;*/
            padding-bottom:80px;
            background:#fff;
            border-radius:3px;
            margin:0 auto;
            padding-top:50px;
            box-sizing: border-box;
        }
        .content{
            margin-bottom:30px;
            display: flex;
            align-items: center;
        }
        .leftItem{
            width:184px;
            font-size:14px;
            color:#333;
            font-weight:500;
            text-align:right;
            margin-right:30px;
        }
        .inputt{
            width:520px;
            height:34px;
            border:1px solid #ccc;
            border-radius:3px;
            box-sizing: border-box;
            padding-left:10px;
            outline:none;
        }
        .addPic{
            width:102px;
            height:102px;
        }
        .yzm{
            width:160px;
            height:34px;
            border:1px solid #ccc;
            border-radius:3px;
            box-sizing: border-box;
            margin-right:30px;
            padding-left:10px;
            font-size:12px;
            color:#333;
        }
        .yzm::-webkit-input-placeholder{
            font-size:12px;
            color:#ccc;
        }
        .code{
            width:100px;
            height:34px;
            line-height:34px;
            text-align:center;
            background:#0065F0;
            border-radius:3px;
            font-size:14px;
            color:#fff;
        }
        .btn{
            margin-left:214px;
            width:130px;
            height:34px;
            line-height:34px;
            text-align: center;
            font-size:12px;
            color:#fff;
            background:#0065F0;
            border-radius:3px;
        }
        .item4_middle{
            display:flex;
        }
        .add{
            position: relative;
            margin-left:10px;
        }
        .delete{
            width:100%;
            height:24px;
            line-height:24px;
            text-align:center;
            position: absolute;
            bottom:0;
            left:0;
            background:rgba(0,0,0,0.4);
            color:#fff;
            font-size:12px;
        }
        .code_gray{
            color:#ccc;
        }
    </style>
</head>

<body>
<header class="wrap3">
    <div class="tt_top3">
        <div class="tt_top33">商家中心 > 认证</div>
    </div>
</header>
<form id="fabutask">
<div class="container">
    <div class="box">
        <div class="content">
            <div class="leftItem">公司名称</div>
            <input type="text" class="inputt company" name="company" value="{$data['s_name']}" minlength="2" maxlength="20">
        </div>
        <div class="content">
            <div class="leftItem">商家地址</div>
            <select class="inputt sheng_ajax" style="width: 160px;margin-right: 20px;">
                <option data-id="" value="">请选择省</option>
                {volist name='sheng' id='p'}
                <option data-id="{$p.district_id}" {if $data.s_sheng == $p.district_id}selected{/if}>{$p.district}</option>
                {/volist}
            </select>
            <select class="inputt shi_ajax" style="width: 160px;margin-right: 20px;">
                <option data-id="" value="">请选择市</option>
                {volist name='shi' id='s'}
                <option data-id="{$s.district_id}" {if $data.s_shi == $s.district_id}selected{/if}>{$s.district}</option>
                {/volist}
            </select>
            <select class="inputt qu_ajax" style="width: 160px;">
                <option data-id="" value="">请选择区</option>
                {volist name='qu' id='q'}
                <option data-id="{$q.district_id}" {if $data.s_qu == $q.district_id}selected{/if}>{$q.district}</option>
                {/volist}
            </select>
        </div>
        <div class="content">
            <div class="leftItem">公司资质证明</div>
            <input type="file" accept="image/*" id="fileimg" onChange="previewimg(this)" style="display:none;" name ="input_image" >
            <div class="item4_middle"  id="uploader">
                <div class="add uploadimg">
                    <img src="__IMG__/addpic.png" alt="" class="addPic">
                </div>
                <div class="add imgshow hidden">
                    <img id="imgsrc" src="" alt="" class="addPic">
                    <div class="delete" onclick="delimg();">
                        删除
                    </div>
                </div>
            </div>
        </div>
        <div class="content">
            <div class="leftItem">三证合一证明</div>
            <input type="file" accept="image/*" id="fileimg1" onChange="previewimg1(this)" style="display:none;" name ="input_image1" >
            <div class="item4_middle"  id="uploader1">
                <div class="add uploadimg1">
                    <img src="__IMG__/addpic.png" alt="" class="addPic">
                </div>
                <div class="add imgshow1 hidden">
                    <img id="imgsrc1" src="" alt="" class="addPic">
                    <div class="delete" onclick="delimgs();">
                        删除
                    </div>
                </div>
            </div>
        </div>
        <div class="content">
            <div class="leftItem">联系人姓名</div>
            <input type="text" class="inputt username" name="username" minlength="2" maxlength="20">
        </div>
        <div class="content">
            <div class="leftItem">联系人电话</div>
            <!--<input type="text" class="inputt ">-->
            <input type="text" name="phone" class="inputt phone" id="phone1" placeholder="手机号" maxlength="11" oninput="value=value.replace(/[^\d]/g,'')">
            <div class="block icon_hide">
                <div class="warning" style="color:red">请输入正确的手机号</div>
            </div>
        </div>
        <style>
            .button-group {
                position: absolute;
                bottom: 20px;
                right: 20px;
                font-size: 12px;
                padding: 10px;
            }

            .button-group .button {
                height: 28px;
                line-height: 28px;
                background-color: #0D9BF2;
                color: #FFF;
                border: 0;
                outline: none;
                padding-left: 5px;
                padding-right: 5px;
                border-radius: 3px;
                margin-bottom: 4px;
                cursor: pointer;
            }
            .button-group .inputtext {
                height: 26px;
                line-height: 26px;
                border: 1px;
                outline: none;
                padding-left: 5px;
                padding-right: 5px;
                border-radius: 3px;
                margin-bottom: 4px;
                cursor: pointer;
            }
            /*
           .tip {
               position: absolute;
               bottom: 30px;
               right: 10px;
               background-color: #FFF;
               text-align: center;
               border: 1px solid #ccc;
               line-height: 30px;
               border-radius: 3px;
               padding: 0 5px;
               font-size: 12px;
           }
           */
            #tip {
                background-color: #fff;
                padding-left: 10px;
                padding-right: 10px;
                position: absolute;
                font-size: 12px;
                right: 10px;
                top: 20px;
                border-radius: 3px;
                border: 1px solid #ccc;
                line-height: 30px;
            }

            /*
            #tip input[type='button'] {
                margin-top: 10px;
                margin-bottom: 10px;
                background-color: #0D9BF2;
                height: 30px;
                text-align: center;
                line-height: 30px;
                color: #fff;
                font-size: 12px;
                border-radius: 3px;
                outline: none;
                border: 0;
            }
            */
            .amap-info-content {
                font-size: 12px;
            }

            #myPageTop {
                position: relative;
                top: -120px;
                right: 10px;
                background: #fff none repeat scroll 0 0;
                border: 1px solid #ccc;
                margin: 10px auto;
                padding:6px;
                font-family: "Microsoft Yahei", "微软雅黑", "Pinghei";
                font-size: 14px;
            }
            #myPageTop label {
                margin: 0 20px 0 0;
                color: #666666;
                font-weight: normal;
            }
            #myPageTop input {
                width: 170px;
            }
            #myPageTop .column2{
                padding-left: 25px;
            }
            /*.amap-marker,.amap_lib_placeSearch_poi{*/
                /*!*不显示定位点标签，因为点击没法应*!*/
                /*display: none;!important;*/
            /*}*/
        </style>
        <div class="content">
            <div class="leftItem">验证码</div>
            <input type="text" class="yzm" name="code" placeholder="请输入">
            <div class="code hand_icon" onclick="sendcode(this);">获取验证码</div>
        </div>
        <div class="content">
            <div class="leftItem">经纬度</div>
            <div id="container" style="width: 750px;height: 300px;float: right"></div>
            <div id="myPageTop">
                <table>
                    <tr>
                        <td>
                            <label>请输入关键字：</label>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input id="tipinput"/>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="btn" style="cursor: pointer">提交</div>
    </div>
</div>
<input type="hidden" name="task_image" id="task_image" value="" /><!--为1没传图  为2已传图-->
<input type="hidden" name="task_image1" id="task_image1" value="" /><!--为1没传图  为2已传图-->
    <input type="hidden" name="s_sheng" id="s_sheng" value="{$data.s_sheng}" /><!--省市区-->
    <input type="hidden" name="s_shi" id="s_shi" value="{$data.s_shi}" /><!--省市区-->
    <input type="hidden" name="s_qu" id="s_qu" value="{$data.s_qu}" /><!--省市区-->
    <input type="hidden" name="s_lat" id="s_lat" value="{$data.s_lat}" /><!--经度-->
    <input type="hidden" name="s_lon" id="s_lon" value="{$data.s_lon}" /><!--纬度-->
    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=3108d268226b46915b5faa028a004245&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>
    <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>
</form>
</body>
{include file="public/footer"}
<script type="text/javascript" src="__JSS__/plugins/layui/layui.all.js"></script>
<script type="text/javascript" src="__JS__/wk.js"></script>
<script type="text/javascript" src="__JS__/webuploader/webuploader.js"></script>
<script src="__JSS__/plugins/wangEditor-3.1.1/release/wangEditor.js" ></script>
<script src="__SCRIPT__/common.js" ></script>
<script>
    var editor = wk.wang({elem:'#LAY_editor',url:"{:url('shop/upload/wangUpload')}"});
    $('.uploadimg').click(function () {
        $('#fileimg').click();
    });
    $('.uploadimg1').click(function () {
        $('#fileimg1').click();
    });
    function delimg(){
        $('.imgshow').addClass('hidden');
        $('#task_image').val('');
    }
    function delimgs(){
        $('.imgshow1').addClass('hidden');
        $('#task_image1').val('');
    }
    function previewimg(obj){
        var src = window.URL.createObjectURL(obj.files[0]);
        $('#imgsrc').attr('src',src);
        $('.imgshow').removeClass('hidden');
        uploadImageCommon('fabutask','task_image');
    }
    function previewimg1(obj){
        var src = window.URL.createObjectURL(obj.files[0]);
        $('#imgsrc1').attr('src',src);
        $('.imgshow1').removeClass('hidden');
        uploadImageCommon1('fabutask','task_image1');
    }
    //发送验证码
    function sendcode(o){
        var obj= $(o);
        obj.removeAttr('onclick');
        if($('#phone1').val() == ""){
            obj.attr("onclick",'sendcode(this)');
            $('#phone1').parent().find('.block').removeClass('icon_hide').find('.warning').text('请输入手机号');
        }else{
            var pattern = /^1[34578]\d{9}$/;
            if(!pattern.test($('#phone1').val())){
                obj.attr("onclick",'sendcode(this)');
                $('#phone1').parent().find('.block').removeClass('icon_hide').find('.warning').text('请输入正确的手机号');
            }else{
                $.ajax({
                    url:"{:url('shop/Center/sendApproveCode')}",
                    type:"post",
                    dataType:"json",
                    data:{type:1,phone:$('#phone1').val()},
                    success:function(res){
                        if(res.code == 200){
                            settime(obj);
                        }else if(res.code == -1){
                            obj.attr("onclick",'sendcode(this)');
                            $('#phone1').parent().find('.block').removeClass('icon_hide').find('.warning').text(res.msg);
                        }else{
                            obj.attr("onclick",'sendcode(this)');
                            $('#pwd').parent().find('.block').removeClass('icon_hide').find('.warning').text(res.msg);
                        }
                    }
                })

            }
        }
    }
    var countdown=60;
    function settime(obj) {
        obj.addClass('code_gray');
        if (countdown == 0) {
            obj.attr("onclick",'sendcode(this)');
            obj.html("获取验证码");
            obj.removeClass('code_gray');
            countdown = 60;
            return;
        } else {
            obj.html("重新发送(" + countdown + ")");
            countdown--;
        }
        setTimeout(function() {
            settime(obj)
        },1000)
    }
    $('.btn').click(function () {
//        var formData = new FormData($( "#fabutask" )[0]);//addForm是表单的id，不是input file的
//        formData.append("task_content", editor.txt.html());
//        formData.append("task_share_content", editor2.txt.html());
//        var repeatSubmit = $('#repeatSubmit').val();
//        if(repeatSubmit == 2){
//            alert('请勿重复提交！');
//            return false;
//        }else{
//            var submitInfo = formCheck();
//            if(submitInfo.status == 200){
//                $('#repeatSubmit').val(2);
        var company = $(".company").val();
        var username = $(".username").val();
        var phone = $(".phone").val();
        var code = $(".yzm").val();
        var task_image = $("#task_image").val();
        var task_image1 = $("#task_image1").val();
        if(company==''){
            alert("公司名称不能为空");
           return false;
        }
        var pid = $('#s_sheng').val();
        var sid = $('#s_shi').val();
        var qid = $('#s_qu').val();
        if(!pid || !sid || !qid){
            alert('地址不能为空');
            return false;
        }
        if(username==''){
            alert("公司联系人姓名不能为空");
            return false;
        }
        if(phone==''){
            alert("公司联系人电话不能为空");
            return false;
        }else{
            var pattern = /^1[34578]\d{9}$/;
            if(!pattern.test(phone)){
                alert("请输入正确的手机号码");
                return false;
            }
        }
        if(code==''){
            alert("验证码不能为空");
            return false;
        }
        if(task_image==''){
            alert("公司资质证明不能为空");
            return false;
        }
        if(task_image1==''){
            alert("三证合一证明不能为空");
            return false;
        }
        var lat = $('#s_lat').val();
        var lon = $('#s_lon').val();
        if(!lat || !lon){
            alert('请点击选择经纬度');
            return false;
        }
        var formData = $( "#fabutask" ).serialize();
        $(this).attr('disabled','disabled').html('提交中...');
        $.ajax({
            url: '/shop/Center/approvePage',
            data: formData,
            type: 'POST',
            dataType: 'JSON',
            success: function (returnData) {
                alert(returnData.msg);
                if(returnData.code == 200){
//                    window.location.reload();
                      window.location.href = '/shop/Center/centerPage';
//                            return true;

                }
            },
            error: function () {
                alert('服务器错误，请刷新重试！');
            }
        })
//        }
    });
</script>
</html>
<script>
    $('.sheng_ajax').change(function () {
        var pid = $('.sheng_ajax option:selected').attr('data-id');
        $('#s_sheng').val(pid);
        $('#s_shi').val('');
        $('#s_qu').val('');
        //
        $(".shi_ajax").empty();
        $(".qu_ajax").empty();
        if(pid == ''){
            $(".shi_ajax").append('<option data-id="" value="">请选择市</option>');
            $(".qu_ajax").append('<option data-id="" value="">请选择区</option>');
            $('.shi_ajax').val('');
            $('.qu_ajax').val('');
        }else {
            $.ajax({
                url: '/shop/Task/getAreaByType',
                data: 'type=2&id='+pid,
                type: 'POST',
                dataType: 'JSON',
                success: function (returnData) {
                    $(".shi_ajax").empty();
                    $(".qu_ajax").empty();
                    $(".shi_ajax").append('<option data-id="" value="">请选择市</option>');
                    $(".qu_ajax").append('<option data-id="" value="">请选择区</option>');
                    var datas = returnData.msg;
                    $.each(datas,function(key,v){
                        $(".shi_ajax").append('<option data-id="'+v.district_id+'">'+v.district+'</option>');
                    });
                },
                error: function () {
                    alert('ajax error，请刷新重试');
                }
            })
        }
    });
    $('.shi_ajax').change(function () {
        var pid = $('.shi_ajax option:selected').attr('data-id');
        $('#s_shi').val(pid);
        $('#s_qu').val('');
        //
        $(".qu_ajax").empty();
        if(pid == ''){
            $('.qu_ajax').val('');
            $(".qu_ajax").append('<option data-id="" value="">请选择区</option>');
        }else {
            $.ajax({
                url: '/shop/Task/getAreaByType',
                data: 'type=3&id='+pid,
                type: 'POST',
                dataType: 'JSON',
                success: function (returnData) {
                    $(".qu_ajax").empty();
                    $(".qu_ajax").append('<option data-id="" value="">请选择区</option>');
                    var datas = returnData.msg;
                    $.each(datas,function(key,v){
                        $(".qu_ajax").append('<option data-id="'+v.district_id+'">'+v.district+'</option>');
                    });
                },
                error: function () {
                    alert('ajax error，请刷新重试');
                }
            })
        }
    });

    $('.qu_ajax').change(function () {
        var pid = $('.qu_ajax option:selected').attr('data-id');
        $('#s_qu').val(pid);
    });
</script>
<script>
    //地图加载
    var map = new AMap.Map("container", {
        resizeEnable: true
    });
    //输入提示
    var autoOptions = {
        input: "tipinput"
    };
    var auto = new AMap.Autocomplete(autoOptions);
    var placeSearch = new AMap.PlaceSearch({
        map: map
    });  //构造地点查询类
    AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
    function select(e) {
        placeSearch.setCity(e.poi.adcode);
        placeSearch.search(e.poi.name);  //关键字查询查询
        var lng = e.poi.location.lng;   //获取经度
        var lat = e.poi.location.lat;
        document.getElementById("s_lon").value = lng;
        document.getElementById("s_lat").value = lat;
    }


    //为地图注册click事件获取鼠标点击出的经纬度坐标
    map.on('click', function(e) {
//        document.getElementById("lnglat").value = e.lnglat.getLng() + ',' + e.lnglat.getLat();
        document.getElementById("s_lon").value = e.lnglat.getLng();
        document.getElementById("s_lat").value = e.lnglat.getLat();
    });

    AMap.event.addListener(placeSearch, "markerClick", addasd);
    function addasd(e) {
//        $('input[name=activity_address]').val(e.data.pname+e.data.cityname+e.data.adname+e.data.name);
        document.getElementById("s_lon").value = e.data.location.lng;
        document.getElementById("s_lat").value = e.data.location.lat;
    }
</script>